<template>
	<view class="vitae">
		<u-navbar bgColor="#fff">
			<view slot="left" class="align-center">
				<image @click="$tools.back()" src="@/static/login/back3.png" style="width: 36rpx; height: 36rpx"></image>
			</view>
			<view slot="center">
				<view style="font-weight: 600; font-size: 36rpx; color: #333333">手动添加</view>
			</view>
		</u-navbar>
		<!--  -->
		<view class="align-center" style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee">
			<view style="margin-right: 30rpx" @click="chooseFun">
				<view class="flex-center1" style="width: 124rpx; height: 124rpx; border-radius: 50%; background: #f4f5f7">
					<image v-if="form.head" :src="form.head" style="width: 124rpx; height: 124rpx; border-radius: 50%"></image>
					<u-icon v-else name="plus" color="#999999" size="46"></u-icon>
				</view>
			</view>
			<view>
				<view class="align-center" style="margin-bottom: 20rpx">
					<input type="text" v-model="form.name" placeholder="请输入姓名" />
					<u-icon name="edit-pen" color="#999999" size="46"></u-icon>
				</view>
				<!-- <view style="margin-bottom: 10rpx; font-weight: 400; font-size: 28rpx; color: #333333">
					{{ userInfo.sex == 1 ? '男' : '女' }} · {{ userInfo.age }}岁 · {{ .phone }}
				</view> -->
				<view class="flex" style="margin-bottom: 10rpx">
					<u-radio-group v-model="form.sex" placement="row" size="35">
						<u-radio
							labelSize="35"
							:customStyle="{ marginBottom: '8px' }"
							v-for="(item, index) in radiolist1"
							:key="index"
							:label="item.name"
							:name="item.type"
							@change="groupChange"
						></u-radio>
					</u-radio-group>
				</view>
				<view class="flex" style="margin-bottom: 20rpx">
					<input v-model="form.age" type="number" placeholder="请输入年龄" />
					岁
				</view>
				<view class="flex">
					<input v-model="form.phone" type="number" placeholder="请输入手机号" />
				</view>
			</view>
		</view>
		<!--  -->
		<view style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee">
			<view style="font-weight: 600; font-size: 32rpx; color: #333333; margin-bottom: 34rpx">工作照片</view>
			<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="10" width="164" height="164" uploadIcon="plus"></u-upload>
		</view>
		<view style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee" @click="$tools.navigite('./plan', 1)">
			<view style="margin-bottom: 28rpx; font-weight: 600; font-size: 32rpx; color: #333333">工作规划，岗位更准</view>
			<view class="flex-between1" style="margin-bottom: 14rpx">
				<text>{{ form.workIntention }} {{ form.income }}</text>
				<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx"></image>
			</view>
			<view style="font-weight: 300; font-size: 28rpx; color: #999999">{{ form.workTime }} {{ form.workAddress }}</view>
		</view>
		<view style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee" @click="$tools.navigite('./plan', 2)">
			<view style="margin-bottom: 28rpx; font-weight: 600; font-size: 32rpx; color: #333333">经历技能，涨薪更多</view>
			<!-- <view class="flex-between1" style="margin-bottom: 14rpx">
				<text>华中科技大学</text>
				<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx"></image>
			</view> -->
			<view style="margin-bottom: 30rpx; font-weight: 300; font-size: 28rpx; color: #999999">{{ form.graduationDate }} {{ form.culture }} {{ form.majorStudied }}</view>
			<u-upload :fileList="fileList2" name="2" multiple :maxCount="10" width="88" height="88" uploadIcon="plus"></u-upload>
		</view>

		<!--  -->
		<!-- <view style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee">
			<view class="flex-between1" style="margin-bottom: 30rpx">
				<text style="font-weight: 600; font-size: 32rpx; color: #333333">工作经历</text>
				<u-icon @click="$tools.navigite('./plan', 3)" name="plus-circle" color="#999999" size="40"></u-icon>
			</view>
			<view v-for="(item, index) in workList" :key="index" style="margin-bottom: 40rpx">
				<view>
					<view class="flex-between1" style="margin-bottom: 14rpx">
						<text style="font-weight: 600; font-size: 28rpx; color: #333333">{{ item.companyName }}</text>
						<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx"></image>
					</view>
					<view style="margin-bottom: 26rpx">
						<text style="font-weight: 300; font-size: 28rpx; color: #999999">{{ item.postName }}</text>
						<text style="font-weight: 300; font-size: 28rpx; color: #999999; margin-left: 60rpx">{{ item.timeStart }}-{{ item.timeEnd }}</text>
					</view>
					<view v-html="item.content.replace(/\n/g, '<br>')" style="font-weight: 300; font-size: 28rpx; color: #999999"></view>
				</view>
			</view>
		</view> -->
		<view style="padding: 40rpx 0; border-bottom: 1rpx solid #eeeeee; margin-bottom: 50rpx">
			<view style="margin-bottom: 28rpx; font-weight: 600; font-size: 32rpx; color: #333333">补充更多，入职更快</view>
			<view class="flex-between1" style="margin-bottom: 40rpx">
				<text>身高</text>
				<view class="align-center">
					<input type="text" v-model="form.height" placeholder="请输入身高" style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right" />
					<text>cm</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view class="flex-between1" style="margin-bottom: 40rpx">
				<text>体重</text>
				<view class="align-center">
					<input type="text" v-model="form.weight" placeholder="请输入体重" style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right" />
					<text>kg</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view class="flex-between1" style="margin-bottom: 30rpx">
				<text>健康证</text>
				<view class="align-center">
					<text style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right">请上传健康证</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view style="margin-bottom: 30rpx">
				<u-upload :fileList="fileList3" @afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="1" width="88" height="88" uploadIcon="plus"></u-upload>
			</view>
			<view @click="show1 = true" class="flex-between1" style="margin-bottom: 40rpx">
				<text>是否有明显纹身</text>
				<view class="align-center">
					<text style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right">{{ form.tattoo == 1 ? '是' : '否' }}</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<u-picker :show="show1" :columns="columns1" @confirm="confirm1" @cancel="show1 = false"></u-picker>
			<view class="flex-between1" style="margin-bottom: 40rpx">
				<text>身体状况</text>
				<view class="align-center">
					<input type="text" v-model="form.body" placeholder="请输入身体状况" style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right" />
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view @click="show2 = true" class="flex-between1" style="margin-bottom: 40rpx">
				<text>是否上社保</text>
				<view class="align-center">
					<text style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right">{{ form.social == 1 ? '是' : '否' }}</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<u-picker :show="show2" :columns="columns1" @confirm="confirm2" @cancel="show2 = false"></u-picker>
			<view class="flex-between1" style="margin-bottom: 30rpx">
				<text>学历证书</text>
				<view class="align-center">
					<text style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right">请上传学位证书</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view style="margin-bottom: 30rpx">
				<u-upload :fileList="fileList4" @afterRead="afterRead" @delete="deletePic" name="4" multiple :maxCount="10" width="88" height="88" uploadIcon="plus"></u-upload>
			</view>
			<view class="flex-between1" style="margin-bottom: 30rpx">
				<text>荣誉证书</text>
				<view class="align-center">
					<text style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right">请上传荣誉证书</text>
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
			<view style="margin-bottom: 30rpx">
				<u-upload :fileList="fileList5" @afterRead="afterRead" @delete="deletePic" name="5" multiple :maxCount="10" width="88" height="88" uploadIcon="plus"></u-upload>
			</view>
			<view class="flex-between1">
				<text>备注</text>
				<view class="align-center">
					<input type="text" v-model="form.remark" placeholder="请输入备注" style="font-weight: 400; font-size: 28rpx; color: #999999; text-align: right" />
					<image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx; margin-left: 20rpx"></image>
				</view>
			</view>
		</view>
		<!--  -->
		<view class="flex-center1">
			<view
				@click="addUserInfo()"
				class="flex-center1"
				style="font-weight: 600; font-size: 32rpx; color: #ffffff; width: 640rpx; height: 96rpx; background: #1365f9; border-radius: 16rpx"
			>
				保存
			</view>
		</view>
	</view>
</template>

<script>
import urls from '@/common/url.js';
export default {
	data() {
		return {
			radiolist1: [
				{
					name: '男',
					type: 1
				},
				{
					name: '女',
					type: 0
				}
			],
			// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
			fileList1: [],
			fileList2: [],
			fileList3: [],
			fileList4: [],
			fileList5: [],
			show: false,
			show1: false,
			columns1: [['是', '否']],
			show2: false,
			form: {
				head: '',
				name: '',
				phone: '',
				sex: '',
				age: '',
				workImage: '',
				workIntention: '',
				income: '',
				workTime: '',
				workAddress: '',
				culture: '',
				graduationDate: '',
				majorStudied: '',
				skills: '',
				height: '',
				weight: '',
				health: '',
				tattoo: '',
				body: '',
				social: '',
				education: '',
				honor: '',
				remark: ''
			}
		};
	},
	onShow() {
		this.init();
	},
	methods: {
		init() {
			if (this.form.workImage) {
				const imglist = this.form.workImage.split(',');
				imglist.map((item, index) => {
					this.$set(this.fileList1, index, { url: item });
				});
			}
			if (this.form.skills) {
				const imglist1 = this.form.skills.split(',');
				imglist1.map((item, index) => {
					this.$set(this.fileList2, index, { url: item });
				});
			}
			if (this.form.health) {
				const imglist2 = this.form.health.split(',');
				imglist2.map((item, index) => {
					this.$set(this.fileList3, index, { url: item });
				});
			}
			if (this.form.education) {
				const imglist4 = this.form.education.split(',');
				imglist4.map((item, index) => {
					this.$set(this.fileList4, index, { url: item });
				});
			}
			if (this.form.honor) {
				const imglist5 = this.form.honor.split(',');
				imglist5.map((item, index) => {
					this.$set(this.fileList5, index, { url: item });
				});
			}
		},
		confirm1(e, key) {
			console.log('confirm', e);
			this.show1 = false;
			this.form.tattoo = e.value[0] == '是' ? 1 : 0;
		},
		confirm2(e, key) {
			console.log('confirm', e);
			this.show2 = false;
			this.form.social = e.value[0] == '是' ? 1 : 0;
		},
		groupChange(n) {
			console.log('groupChange', n);
			this.form.sex = n;
		},
		addUserInfo() {
			this.$request('front/company/addUserInfo', this.form).then((res) => {
				console.log(res, 'sssss');
				if (res.code == 0) {
					this.$u.toast('操作成功');
					setTimeout(() => {
						this.$tools.back();
					}, 1000);
				} else {
					this.$u.toast(res.msg);
				}
			});
		},
		//修改头像
		chooseFun() {
			this.$utils.choose().then((res) => {
				console.log(res);
				let tempFilePaths = res.tempFilePaths;
				uni.showLoading();
				this.$utils.uploadFile('front/search/uploadImage', tempFilePaths, {}).then((result) => {
					console.log(result, '头像');
					this.form.head = JSON.parse(result.data).obj;
				});
			});
		},
		setimg(event, key) {
			const list = [];
			this[`fileList${event.name}`].map((item, index) => {
				list.push(item.url);
			});
			const fileList1str = list.join(',');
			this.$set(this.form, key, fileList1str);
			console.log(this.form);
		},
		// 删除图片
		deletePic(event) {
			this[`fileList${event.name}`].splice(event.index, 1);
			this.setimg(event);
		},
		// 新增图片
		async afterRead(event) {
			// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
			let lists = [].concat(event.file);
			let fileListLen = this[`fileList${event.name}`].length;
			lists.map((item) => {
				this[`fileList${event.name}`].push({
					...item,
					status: 'uploading',
					message: '上传中'
				});
			});
			for (let i = 0; i < lists.length; i++) {
				const result = await this.uploadFilePromise(lists[i].url);
				let item = this[`fileList${event.name}`][fileListLen];
				this[`fileList${event.name}`].splice(
					fileListLen,
					1,
					Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					})
				);
				fileListLen++;
			}
			switch (event.name) {
				case '1':
					this.setimg(event, 'workImage');
					break;
				case '3':
					this.setimg(event, 'health');
					break;
				case '4':
					this.setimg(event, 'education');
					break;
				case '5':
					this.setimg(event, 'honor');
					break;
			}
		}
	}
};
</script>

<style lang="less" scoped>
.vitae {
	padding: 180rpx 32rpx;
}
</style>
